<!DOCTYPE html>
<!-- 
Template Name: Metronic - Responsive Admin Dashboard Template build with Twitter Bootstrap 3.1.1
Version: 2.0.2
Author: KeenThemes
Website: http://www.keenthemes.com/
Contact: support@keenthemes.com
Purchase: http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes
License: You must have a valid license purchased only from themeforest(the above link) in order to legally use the theme for your project.
-->
<!--[if IE 8]>
<html lang="en" class="ie8 no-js">
	<![endif]-->
	<!--[if IE 9]>
	<html lang="en" class="ie9 no-js">
		<![endif]-->
		<!--[if !IE]>
		<!-->
		<!--<![endif]-->
		<!-- BEGIN HEAD -->
		<link rel="stylesheet" href="./assets/css/site.css"/>
		<style type="text/css">
.site_content div{
list-style: none;
margin: 0;
padding: 0;
font-family: Microsoft Yahei;
display: block;
}
.site_content .tab_box {
font-size: 16px;
height: 70px;
line-height: 70px;
/*padding-left: 25px;*/
background-color: #fff;
}
.site_content {
height: auto;
border-top: 0;
}
.tab_box .tab_tit.active, .tab_box .tab_tit.active:hover {
color: #009fcd;
border-bottom: 2px solid #009fcd;
cursor: inherit;
}
.tab_box .tab_tit {
display: inline-block;
padding: 0 40px;
cursor: pointer;
}
.site_content .add_export {
float: right;
width: 250px;
height: 20px;
margin-top: 10px;
}
.site_content .add_export #export {
background: #019fce;
}
.site_content .add_export input {
line-height: 20px;
border: 1px;
font-size: 15px;
color: #FFFFFF;
border-radius: 4px;
background: #f3f3f3;
float: right;
margin-right: 15px;
padding: 5px;
cursor: pointer;
}
.site_content .add_export #add_site {
background: #88888a;
}
.lightDiv{
border: solid 3px rgba(1, 160, 207, 0);
}
p{
font-size: 16px;
}
#operate1 input[type="button"]{
background-color: #01a0cf;
}
#operate1 input[type="button"]:hover{
background-color: #f3f3f3;
color:#000;
}
.page-content{
background: #fff;
}
ul.page-sidebar-menu{
	min-height: 600px;
}
.foot{
	background: #fff;

}
	.foot p{
		font-size: 13px;
	}
	.bgColor{
	    background: #01a0cf;
	    padding: 6px 10px;
	    position: absolute;
	    top: 10px;
	    right: 197px;
    	color: #fff;
	}
</style>
		<!-- BEGIN BODY -->
<body class="page-header-fixed">
		<div class="site_content" id="tab_div">
			<!--<div class="tab_box">
			-->
			<div class="content_box">
				<div class="tabbable tabbable-custom tabbable-full-width">
					<ul class="nav nav-tabs" style="position: relative;">
						<!-- <a class="bgColor" data-toggle="modal" data-target="#addModel">增加电桩</a> -->
						<div class="operate" id="operate1" style="position: absolute;top:-10px;right: 100px">
							<input type="button" value="批量删除" class="all_delete"  
		ng-click="batchDeleteDCPile();" style="padding-top:6px;padding-bottom:6px;" />
						</div>
						<li ng-class="{active:tabFlag=='normal'}">
							<a href="javascript:;" ng-click="tabFlag='normal';changeSelectedStatus('dz_qb');">正常电桩</a>
						</li>
						<li ng-class="{active:tabFlag=='malfunction'}">
							<a href="javascript:;" ng-click="tabFlag='malfunction';changeSelectedStatus('dz_gz');">故障电桩</a>
						</li>
						<span class="add_export">
							<input type="button" id="export" value="数据导出" ng-click="exportDcPile()"/>
						</span>
					</ul>
					<div class="tab-content">
						<div class="tab-pane active" id="tab_1_1">
							<div class="realtime_content tab_div">
								<div class="dzgl_state tab1 bg_white">
									<div id="dz_qb" ng-class="{lightDiv:selectedStatus=='dz_qb'}" ng-if="tabFlag=='normal'"
		ng-click="changeSelectedStatus('dz_qb');">
										<div class="bg_white bd" id='count'>
											<img src="./assets/img/evcharger/orange.jpg"> <font class="c_orange" ng-bind="allDCPileStatus.total"></font>
										</div>
										<p class="c_white bg_orange">全部</p>
									</div>
									<div id="dz_kx" ng-class="{lightDiv:selectedStatus=='dz_kx'}" ng-if="tabFlag=='normal'"
		ng-click="changeSelectedStatus('dz_kx');">
										<div class="bg_white bd" id="release">
											<img src="./assets/img/evcharger/green.jpg"> <font class="c_green" ng-bind="allDCPileStatus.free_no"></font>
										</div>
										<p class="c_white bg_green" >空闲</p>
									</div>
									<div id="dz_cd" ng-class="{lightDiv:selectedStatus=='dz_cd'}" ng-if="tabFlag=='normal'"
		ng-click="changeSelectedStatus('dz_cd');">
										<div class="bg_white bd" id="charge">
											<img src="./assets/img/evcharger/blue.jpg">
											<font class="c_blue" ng-bind="allDCPileStatus.charge_no"></font>
										</div>
										<p class="c_white bg_blue" >充电</p>
									</div>
									<div id="dz_yy" ng-class="{lightDiv:selectedStatus=='dz_yy'}" ng-if="tabFlag=='normal'"
		ng-click="changeSelectedStatus('dz_yy');">
										<div class="bg_white bd" id="bespeak">
											<img src="./assets/img/evcharger/yellow.jpg">
											<font class="c_yellow" ng-bind="allDCPileStatus.bespeak_no"></font>
										</div>
										<p class="c_white bg_yellow" >预约</p>
									</div>
									<div id="dz_lx" ng-class="{lightDiv:selectedStatus=='dz_lx'}" ng-if="tabFlag=='normal'"
		ng-click="changeSelectedStatus('dz_lx');">
										<div class="bg_white" id="offline">
											<img src="./assets/img/evcharger/grayblue.jpg">
											<font class="c_blueGray" ng-bind="allDCPileStatus.offline_no"></font>
										</div>
										<p class="c_white bg_blueGray" >离线</p>
									</div>
									<div id="dz_gz" ng-class="{lightDiv:selectedStatus=='dz_gz'}" ng-if="tabFlag=='malfunction'" ng-click="changeSelectedStatus('dz_gz');">
										<div class="bg_white" id='error'>
											<img src="./assets/img/evcharger/gray.png">
											<font class="c_gray" ng-bind="allDCPileStatus.error_no"></font>
										</div>
										<p class="c_white" style="background-color:#aaa" >故障</p>
									</div>
								</div>
								<hr style="margin: 0" />
								<search-data></search-data>
								<table class="table table-striped table-bordered table-hover" id="table_1">
									<thead>
										<tr>
											<th style="padding-bottom: 12px;padding-top: 0">
												<input type="checkbox" class="checkbox_table" />
											</th>
											<th>电桩ID</th>
											<th>运营二维码</th>
											<th>站点名称</th>
											<th>站点所在地</th>
											<th>站内编号</th>
											<th>电桩状态</th>
											<th>操作</th>
										</tr>
									</thead>
									<tbody>
										<tr ng-repeat="DCP in DCPileList  track by $index" pg-loaded="{{$last}}" target-table="table_1">
											<td>
												<input type="checkbox" class="checkbox_table" name="chargerRowModel"
			 value="{{DCP.charger_id}}" />
											</td>
											<td>
												<span ng-bind="DCP.charger_id"></span>
											</td>
											<td>
												<span ng-bind="DCP.qr_code" ng-if="!!DCP.qr_code"></span>
												<a class="btn" href="javascript:;" ng-if="!!!DCP.qr_code" ng-click="generateQrCode(DCP);">生成并下发二维码</a>
											</td>
											<td>
												<span ng-bind="DCP.station_name"></span>
											</td>
											<td>
												<span ng-bind="DCP.district_name"></span>

											</td>
											<td>
												<span ng-bind="DCP.serial_no"></span>

											</td>
											<td>
												<span ng-repeat="Status in DCP.chargeStatusList track by $index"
				ng-class="{greenFont:Status.chargeOnLineStatus==1 && Status.chargeStatus==0,
	                                            yellowFont:Status.chargeOnLineStatus==1 && (Status.chargeStatus==1||Status.chargeStatus==5),
	                                            blueFont:Status.chargeOnLineStatus==1 && Status.chargeStatus==2,
	                                            gredFont:Status.chargeOnLineStatus==1 && (Status.chargeStatus==3||Status.chargeStatus==4),
	                                            darkBlueFont:Status.chargeOnLineStatus==0}">
													{{$index | getValueInStaticFilter : 'chargeInterfaceArray' }}
													<i ng-if="Status.chargeOnLineStatus==0">离线中</i>
													<i ng-if="Status.chargeOnLineStatus==1">{{Status.chargeStatus | getValueInStaticFilter : 'chargeStatusArray' }}</i>
													<span ng-if="!$last">/</span>
												</span>
											</td>
											<td style="padding: 0">
												<a class="btn" data-target="#" href="index.html#/DCPileDetail/直流桩详情/电桩管理/DCPileDetail/{{DCP.charger_id}}">查看</a>
												<a class="btn" data-target="#" ng-click="batchDeleteDCPile(DCP.charger_id);">删除</a>
											</td>
										</tr>
									</tbody>
								</table>
								<tm-pagination conf="paginationConf"></tm-pagination>
								<div id="table_page"></div>	
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
						<div id="addModel" class="modal fade" role="dialog" aria-hidden="true" data-backdrop="false">
							<div class="modal-dialog"  style="width:1000px">
								<div class="modal-content">
									<form class="w5c-form demo-form" role="form" w5c-form-validate="vm.validateOptions" novalidate name="validateForm">
										<div class="modal-header">
											<button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="validateForm.reset()">×</button>
											<h4 class="modal-title">电桩信息新增</h4>
										</div>
										<div class="modal-body form">
					             <div class="form-group">
					             	<div class="row">
					             		<label class="col-sm-2 control-label text-right"><span class="star-color">* </span>电桩地址</label>
					             		<div class="col-sm-4">
                                        <div class="input-group">
                                          <input type="text" class="form-control validInput" ng-model="modifyPileInfo.charger_id" name="charger_id" required=""/>
                                        </div>
                                      </div>
                                      <label class="col-sm-2 control-label text-right"><span class="star-color"></span>运营二维码</label>
                                      <div class="col-sm-4">
                                        <div class="input-group">
                                          <input type="text" class="form-control validInput" ng-model="modifyPileInfo.qr_code" ng-readonly="true" name="qr_code" />
                                        </div>
                                      </div>
					             	</div>
                                    <div class="row">
                                      <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>端口数目</label>
                                      <div class="col-sm-4">
                                          <select class="form-control validInput" ng-model="encrypt_type" name="encrypt_type" required="">
                                            <option value="">请选择端口数目</option>
                                            <option value="1">单枪</option>
                                            <option value="2">双枪</option>
                                          </select>
                                      </div>
                                       <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>编号</label>
                                      <div class="col-sm-4">
										<div class="input-group">
											<input type="text" class="form-control" ng-model="selectedDeivceType.device_code" required="" name="device_code" ng-maxlength="50" ng-pattern="/^\w*$/"/>
										</div>
                                      </div>
                                    </div>
                                    <div class="row">
                                      <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>充电运营服务商</label>
                                      <div class="col-sm-4">
                                        <div class="input-group">
                                          <select class="form-control validInput" 
                                              ng-options="operMechant.oper_merchant_id as operMechant.oper_name for operMechant in operMechantList "  
                                              ng-model="modifyPileInfo.oper_merchant_id" required="" name="oper_merchant_id">
                                              <option value="">请选择服务商</option>
                                          </select>
                                        </div>
                                      </div>
                                      <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>厂商</label>
                                      <div class="col-sm-4">
                                        <div class="input-group">
                                          <select class="form-control validInput" 
                                          ng-options="merchant.merchant_id as merchant.name for merchant in merchantList "
                                          ng-model="modifyPileInfo.entity_id" id="selectEntity" name="entity_id" required="">
                                          <option value="">请选择厂商</option>
                                          </select>
                                        </div>
                                      </div>
                                    </div>
                                     <div class="row">
                                     <label class="col-sm-2 control-label text-right"> <span class="star-color">* </span>通讯协议类型</label>
                                      <div class="col-sm-4">
                                        <div class="input-group">
                                          <select class="form-control" ng-model="modifyPileInfo.protocol_type" required="" name="protocol_type">
                                            <option value="">请选择通讯协议类型</option>
                                            <option value="1">EV3C</option>
                                            <option value="2">Protocol Translate</option>
                                            <option value="3">P2P</option>
                                          </select>
                                        </div>
                                      </div>
                                      <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>通讯协议版本号</label>
                                      <div class="col-sm-4">
                                        <div class="input-group">
                                          <input type="text" class="form-control" ng-model="modifyPileInfo.protocol_version" required=""/>
                                        </div>
                                      </div>
                                    </div>
                                    <div class="row">
                                      <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>一级类型</label>
                                      <div class="col-sm-4">
										<div class="input-group" ng-model="selectedDeivceType.dev_type1">
											<select class="form-control" ng-model="subset1" name="subset1" required="">
												<option value="">请选择</option>
												<option value="0">壁挂式</option>
												<option value="1" selected="selected">立式</option>
												<option value="2">内嵌式</option>
												<option value="F">其它</option>
											</select>
											<select class="form-control sudden" ng-model="subset2" name="subset2" required="">
												<option value="">请选择</option>
												<option value="0" selected="selected">单枪单充</option>
												<option value="1">双枪双充</option>
												<option value="2">双枪单充</option>
											</select>
										</div>
                                      </div>
                                        <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>二级类型</label>
                                        <div class="col-sm-4">
										<div class="input-group">
											<select class="form-control" ng-model="selectedDeivceType.dev_type2" name="dev_type2" required="">
												<option value="">请选择</option>
												<option value="00">小于等于3.5KW</option>
												<option value="01">大于3.5KW小于等于8KW</option>
												<option value="02">大于8KW小于等于100KW</option>
												<option value="03 ">大于100KW</option>
											</select>
										</div>
                                        </div>
                                    </div>
                                    <div style="clear: both;"></div>
                                    <div class="row">
                                      <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>电流类型</label>
                                      <div class="col-sm-4">
										<div class="input-group">
											<select class="form-control" ng-model="selectedDeivceType.charger_type" name="charger_type" required="">
												<option value="">请选择</option>
												<option value="1" selected="selected">直流</option>
												<option value="2">交流</option>
												<option value="3">混合</option>
											</select>
										</div>
                                      </div>
                                       <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>充电类型</label>
                                      <div class="col-sm-4">
										<div class="input-group">
											<select class="form-control" ng-model="selectedDeivceType.dev_charge_type" name="dev_charge_type" required="">
												<option value="">请选择</option>
												<option value="1">慢充</option>
												<option value="2">快充</option>
												<option value="3">未知</option>
											</select>
										</div>
                                      </div>
                                    </div>
                                     <div class="row">
                                      <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>接口类型</label>
                                      <div class="col-sm-4">
										<div class="input-group">
											<select class="form-control" ng-model="selectedDeivceType.charge_port_type"  name="charge_port_type" required="">
												<option value="">请选择</option>
												<option value="1">国标</option>
												<option value="2">特斯拉</option>
												<option value="3">ABB</option>
												<option value="3">其他</option>
											</select>
										</div>
                                      </div>
                                       <label class="col-sm-2 control-label text-right"><span class="star-color">* </span>连接类型</label>
                                      <div class="col-sm-4">
										<div class="input-group">
											<select class="form-control" ng-model="selectedDeivceType.connect_type" name="connect_type" required="">
												<option value="">请选择</option>
												<option value="1">在线桩（GPRS桩）</option>
												<option value="2">离线桩（蓝牙桩）</option>
											</select>
										</div>
                                      </div>
                                    </div>
                                  </div>
										</div>
										<div class="modal-footer">
											<button type="button" class="btn btn-danger" data-dismiss="modal" ng-click="validateForm.reset()"> <i class="fa fa-times"></i>
												关闭
											</button>
											<button type="button" class="btn btn-primary" w5c-form-submit="modifyOwnOnlineStation();"> <i class="fa fa-check"></i>
												保存
											</button>
										</div>
									</form>
								</div>
							</div>
						</div>
</body>
		<!-- END BODY -->
	</html>